<template>
	<view>
		<cu-custom title="邀请好友奖" bgColor="rgba(255,255,255,0)" ></cu-custom>
		<view class="top-mor bg-white m-15 flex">
			<view class="bor-box t-a-c" style="width: 50%;">
				<text class="d-p-b f-18">本月提成总业绩</text>
				<text class="money">0元</text>
			</view>
			<view class="bor-box t-a-c" style="width: 50%;">
				<text class="d-p-b f-18">本月提成总业绩</text>
				<text class="money">0元</text>
			</view>
		</view>
		<view class="t-a-c f-18 m-b-5">——我邀请的用户列表——</view>
		<view class="t-a-c f-18 c-o-9">
			请尽快引导您邀请的学员在平台充值
		</view>
		<view class="bot-img bg-white p-15">
			<view class="t-a-c"><text class="c-o-9">排序：</text><text>注册时间由近到远</text><uni-icons type="bottom" size="20"></uni-icons></view>
			<view class="t-a-c" style="margin-top: 30px; margin-bottom: 50px;">
				<image src="../../static/images/no.png"></image>
				<text class="d-p-b f-18 c-o-9" style="line-height: 40px;">您暂时还没有邀请的学员赶紧转发推荐海报或链接先让更多的学员来注册吧</text>
			</view>
		</view>
		
		<view class="bg-tou" id="nonebg" ref="closebox">
			<view class="bot-fixed bg-white">
				<view class="t-a-c m-15 f-18 f-w-b">请选择要转发的渠道</view>
				<view class="flex">
					<view class="img-list">
						<image src="../../static/images/wechat.png"></image>
						<text class="f-18">微信</text>
					</view>
					<view class="img-list">
						<image src="../../static/images/pengyouquan.png"></image>
						<text class="f-18">朋友圈</text>
					</view>
					<view class="img-list">
						<image src="../../static/images/qq.png"></image>
						<text class="f-18">QQ</text>
					</view>
					<view class="img-list">
						<image src="../../static/images/weibo.png"></image>
						<text class="f-18">微博</text>
					</view>
				</view>
				<view class="cancel t-a-c f-20" @click="close()" id="closemain">取消</view>
			</view>
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		
		mounted() {
			// 这里先调用一遍，看起来没啥用		 
		    this.close() ;

		},
		methods: {
			close() {
				var nonebg = document.getElementById('nonebg');
				var closemain = document.getElementById('closemain');
				closemain.onclick = function() {
					
				    nonebg.style.display = "none";
				}
					// this.$refs.nonebg.close()
				}
		}
	}
</script>

<style lang="less" scoped>
@import '@/static/css/common.css';
.top-mor{ border-radius: 20px;}
.bor-box{ padding-top: 20px; padding-bottom: 20px;}
.money{ font-size: 24px;}
.bot-img{ margin: 15px; border-radius: 20px;}
.bg-tou{ background: rgba(0,0,0,0.5); z-index: 10; width: 100%; height: 100%; position: absolute;top: 0; left: 0;}
.bot-fixed{ z-index: 99; position: fixed; bottom: 0; height: 200px; width: 100%;}
.img-list{ width: 25%; text-align: center;
image{ width: 50px; height: 40px;}
text{ display: block; line-height: 30px;}

}
.cancel{  margin-top: 20px;}
</style>
